const legendData = ['box_loss', 'ds_loss', 'dfl_loss']
const xAxisData = ['5', '10', '15', '20', '25']
const seriesData = [
  {
    name: 'box_loss',
    type: 'line',
    smooth: false, //是否平滑显示折现
    data: [1.2, 1.0, 0.5, 2, 1.6, 2.5]
  },
  {
    name: 'ds_loss',
    type: 'line',
    smooth: false, //是否平滑显示折现
    data: [0.5, 2, 1.6, 4, 2.5, 1.2]
  },
  {
    name: 'dfl_loss',
    type: 'line',
    smooth: 0.2, //是否平滑显示折现
    data: [2, 1.6, 4, 2.5, 1.2, 1.0]
  }
]

const option1 = {
  color: ['#327bfa', '#35b1fa', '#62d56b'],
  title: {
    text: '',
    textStyle: {
      color: '#333',
      fontSize: '14',
      fontWeight: 'normal'
    }
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: {
    top: '0',
    data: legendData
  },
  grid: {
    left: '3%',
    right: '1%',
    bottom: '30',
    containLabel: true
  },
  toolbox: {
    feature: {
      saveAsImage: {}
    }
  },
  xAxis: {
    type: 'category',
    boundaryGap: false, //默认从0刻度开始画图
    //修改X轴 隐藏刻度，修改轴线颜色为ccc、修改X轴文字颜色为666（Y轴同理）
    axisTick: {
      show: false
    },
    axisLine: {
      lineStyle: {
        color: '#ccc'
      }
    },
    splitLine: {
      show: false
    },
    axisLabel: {
      color: '#666'
    },
    data: xAxisData
  },
  yAxis: {
    type: 'value',
    name: '',
    nameTextStyle: {
      color: '#666'
    },
    axisTick: {
      show: false
    },
    splitLine: {
      show: true
    },
    axisLine: {
      lineStyle: {
        color: '#ccc'
      }
    },
    axisLabel: {
      color: '#666'
    }
  },
  series: seriesData
}

const legendData2 = ['person', 'dog', 'cat', 'bicycle', 'bird', 'car']
const xAxisData2 = [0, 0.2, 0.4, 0.6, 0.8, 1.0]
const seriesData2 = [
  {
    name: 'person',
    type: 'line',
    smooth: false, //是否平滑显示折现
    data: [0, 0.6, 0.8, 1.0, 0.2, 0.4] // 0-1的浮点数
  },
  {
    name: 'dog',
    type: 'line',
    smooth: false, //是否平滑显示折现
    data: [0.5, 0.2, 0.6, 0.44, 0.5, 0.2]
  },
  {
    name: 'cat',
    type: 'line',
    smooth: false, //是否平滑显示折现
    data: [0.2, 0.6, 0.5, 0.2, 0.6, 0.44]
  },
  {
    name: 'bicycle',
    type: 'line',
    smooth: false, //是否平滑显示折现
    data: [0.73, 0.15, 0.9, 0.52, 0.69, 0.25, 0.88, 0.41, 0.69, 0.18]
  },
  {
    name: 'bird',
    type: 'line',
    smooth: false, //是否平滑显示折现
    data: [0.42, 0.95, 0.37, 0.61, 0.84, 0.29, 0.73, 0.58, 0.11, 0.63]
  },
  {
    name: 'car',
    type: 'line',
    smooth: false, //是否平滑显示折现
    data: [0.1, 0.1, 0.1, 0.1, 0.3, 0.3, 0.3, 0.3]
  }
]
const option2 = {
  color: ['#327bfa', '#35b1fa', '#62d56b', '#34f333', '#f4567a', '#edf456'],
  title: {
    text: '',
    textStyle: {
      color: '#333',
      fontSize: '14',
      fontWeight: 'normal'
    }
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: {
    orient: 'vertical', // 图例垂直排列
    right: '30', // 图例放在右边
    top: '50', // 图例垂直居中
    width: 200, // 设置图例区域宽度
    borderColor: '#dbdbdb', // 设置边框颜色
    borderWidth: 1, // 设置边框宽度
    padding: [5, 25, 5, 25],
    icon: 'rect',
    textStyle: {
      padding: [5, 15, 5, 15]
    },
    data: legendData2
  },
  grid: {
    left: '10%', // 留出10%的宽度给图表左边
    right: '20%', // 留出20%的宽度给右边的图例
    bottom: '10%', // 留出10%的宽度给底部
    top: '10%'
  },
  toolbox: {
    feature: {
      saveAsImage: {}
    }
  },
  xAxis: {
    width: '80%',
    type: 'category',
    boundaryGap: false, //默认从0刻度开始画图
    //修改X轴 隐藏刻度，修改轴线颜色为ccc、修改X轴文字颜色为666（Y轴同理）
    axisTick: {
      show: false
    },
    axisLine: {
      lineStyle: {
        color: '#ccc'
      }
    },
    splitLine: {
      show: false
    },
    axisLabel: {
      color: '#666'
    },
    data: xAxisData2
  },
  yAxis: {
    type: 'value',
    name: '',
    nameTextStyle: {
      color: '#666'
    },
    axisTick: {
      show: false
    },
    splitLine: {
      show: false
    },
    axisLine: {
      lineStyle: {
        color: '#ccc'
      }
    },
    axisLabel: {
      color: '#666'
    }
  },
  series: seriesData2
}

export { option1, option2 }
